<g:render template="../home/header" ></g:render>
<script>
    function isInvoice(v){
        if(v == 1){
            $('#invoiceInfo_id').css('display','block')
        }else{
            $('#invoiceInfo_id').css('display','none')
        }
    }
    function isUnit(v){
        if(v == 2){
            $('#invoiceTitle').css('display','block')
        }else{
            $('#invoiceTitle').css('display','none')
        }
    }
    function verifyNull(idName ,content,selector){
        if(!$("#"+idName).val()){
            $("#"+selector).html("请输入"+content);
        } else{
            $("#"+selector).html("");
        }
    }

    var saveAddressInfo= function () {
        var province=$("#form-province").val();
        var consignee = $("#form-consignee").val();
        if(consignee==""){
            $("#remindConsignee").html("请输入收货人");
            return;
        }
        if(province==""){
            $("#remindChoose").html("请选择收货地址-省份");
            return;
        }
        var city=$("#form-city").val();
        if(city==""){
            $("#remindChoose").html("收货地址-城市");
            return;
        }
        var district=$("#form-district").val();
        if(district==""){
            $("#remindChoose").html("收货地址-县区");
            return;
        }
        var address=$("#form-address").val();
        if(address==""){
            $("#remindConsignee").html("请输入详细地址");
            return;
        }
        var postCode=$("#form-postCode").val();
        if(postCode==""){
            $("#remindPostcode").html("请输入邮编");
            return;
        }

        $.ajax({
            type: "POST",
            url: "<g:createLink controller="order" action="saveAddress"/>",
            data: {province:province, city: city, district: district, address: address, postCode:postCode,consignee:consignee},
            dataType: "JSON",
            success: function (data) {
                if(data.status){
                    sAlert('保存成功')
                }else{
                    sAlert(data.msg)
                }
            },
            error: function (data, status, e)//服务器响应失败处理函数
            {
                alert(e);
            }
        });
    }

</script>
<div class="load_blk upload_area mTo_20" >
    <div class="crumbs mLe_20" style="border: 0;">
        <span>作品详情</span><em class="tubiao2">&nbsp;</em><span>购买作品</span><em class="tubiao2">&nbsp;</em><span>确认订单</span>
    </div>
    <div class="pic_blk1" style="display: none;">
        <img src="../${photo?.bigImagePath}" border="0" class="img" >
    </div>
</div>
<div class="kong_20"></div>
<div class="load_blk load_blk_ying">
    <g:form method="post" controller="order" action="saveOrder" params="[id:photo?.id]" onsubmit="return check()">

    <div class="pTo_30">
        <div class="zp_xxzp1 green" style="font-size: 20px; margin-left: 80px;">收货信息</div>
        <div class="zp_zi">
            <label> 收货人：</label>
            <div class="zp_InXX">
                <input type="text" name="consignee" value="${user?.address[0]?.consignee}" class="zp_zi_text" id="form-consignee" onblur="verifyNull('form-consignee','收货人','remindConsignee')">
                <span class="fs_12 red" id="remindConsignee"></span>
            </div>
        </div>
        <div class="zp_zi">
            <label> 收货地址：</label>
            <div class="zp_InXX">
                    <div class="form-group form-field field-province span1 f_l">
                        <label class="col-sm-3 control-label no-padding-right label_1" for="form-province"> 省份: </label>
                        <div class="col-sm-8">
                        <g:select name="province" id="form-province" optionKey="id" optionValue="name" value="${user?.address[0]?.province?.id}" class="width-50"
                                  noSelection="${['':'--请选择--']}" from="${provinceList}"
                                  onchange="updateCity();">
                        </g:select>省
                        </div>
                    %{--<div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>--}%
                    </div>

                    <div class="form-group form-field field-city span1 f_l">
                        <label class="col-sm-3 control-label no-padding-right label_1" for="form-city"> 城市: </label>
                        <div class="col-sm-8">
                            <div id="city">
                                <g:select name="city" id="form-city" optionKey="id" optionValue="name" value="${user?.address[0]?.city?.id}" class="width-50"
                                          noSelection="${['':'--请选择--']}" from="${cityList}">
                                </g:select>市
                            </div>
                        </div>
                        %{--<div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>--}%
                    </div>

                    <div class="form-group form-field field-district span1 f_l">
                        <label class="col-sm-3 control-label no-padding-right label_1" for="form-district"> 区(县): </label>
                        <div class="col-sm-8" style="padding-right:0;">
                            <div id="district">
                                <g:select name="district" id="form-district" optionKey="id" optionValue="name" value="${user?.address[0]?.district?.id}" class="width-50"
                                          noSelection="${['':'--请选择--']}" from="${districtList}">
                                </g:select>区(县)
                            </div>
                        </div>
                        %{--<div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>--}%
                    </div>
            </div>
            <span class="fs_12 red" style="height: 40px; line-height:40px;" id="remindChoose"></span>
        </div>
        <div class="zp_zi form-group form-field field-address">
            <label class="%{--col-sm-3 control-label no-padding-right--}%" for="form-address"> 详细地址： </label>
            <div class="col-sm-5 f_l">
                <g:textArea rows="5" cols="40"  name="address" id="form-address" value="${user?.address[0]?.address}" placeholder="详细地址" class="width-100" onblur="verifyNull('form-address','详细地址','remindAddress')" />
            </div>
            <span  class="fs_12 red" id="remindAddress"></span>
            <div class="help-block col-xs-12 col-sm-reset inline fieldMsg"> </div>
        </div>
        <div class="zp_zi form-group form-field field-postCode">
            <label class="%{--col-sm-3 control-label no-padding-right--}%" for="form-postCode"> 邮编：</label>
            <div class="zp_InXX">
                <g:textField  name="postCode" id="form-postCode" rows="5" cols="40"  value="${user?.address[0]?.postCode}" placeholder="邮编" class="width-30 zp_zi_text" onblur="verifyNull('form-postCode','邮编','remindPostcode')"/>
                <span class="fs_12 red" id="remindPostcode"></span>
            </div>
            <div class="help-block col-xs-12 col-sm-reset inline fieldMsg"></div>
        </div>
        <div class="clearfix form-actions zp_zi">
            <div class="load_btnqu col-md-9">
                <a href="javascript:;" onclick="saveAddressInfo()"  style=" margin-left: 90px; padding: 0 4px;" class="annui annui1">保存为默认收货地址</a>
            </div>
        </div>
        <div class="zp_zi">
            <label> 联系电话：</label><div class="zp_InXX"><input type="text" name="phoneNum" class="zp_zi_text"></div>
        </div>

        <div class="kong_20"></div>
        <div class="zp_xxzp1 green" style="font-size: 20px; margin-left: 80px;">发票信息</div>
        <div id="isInvoiceData" class="zp_zi">
            <label style="width: 120px;"> 是否开具发票：</label>
            <div class="zp_InXX"><g:select name="isInvoiceData" from="${isInvoiceData}" optionKey="id" optionValue="text"  onchange="isInvoice(value)"></g:select></div>
        </div>
        <div  id="invoiceInfo_id" style="display:none; ">
            <div id="invoiceTypeData" class="zp_zi" style="margin: 30px auto 0;">
                <label> 发票类型：</label>
                <div class="zp_InXX"><g:select name="invoiceTypeData" from="${invoiceTypeData}" optionKey="id" optionValue="text" onchange="isUnit(value)"></g:select></div>
            </div>
            <div id="invoiceSortData" class="zp_zi" style="margin: 30px auto 0;">
                <label> 发票种类：</label>
                <div class="zp_InXX"><g:select name="invoiceSortData" from="${invoiceSortData}" optionKey="id" optionValue="text"></g:select></div>
            </div>
            <div  id="invoiceTitle" class="zp_zi" style="margin: 30px auto 0;display:none;">
                <label> 单位名称：</label><div class="zp_InXX"><input type="text" name="invoiceTitle" class="zp_zi_text"></div>
            </div>
        </div>
        %{--/发票信息--}%
        <div class="zp_zi">
            <div  class="load_btnqu">
                    <input type="submit" value="确认支付"class="annui annui2">
            </div>
        </div>
     </g:form>

    <script>
        (function($) {
            $(".selectPicker").selectPicker({
                width: 700, height: 500
            });
            $(".chosen-select").chosen();
            $('#form').ajaxForm({
                beforeSubmit: function() {
                    $("#form").jqFormClearErr();
                    $("#form").find("input[type=submit]").attr("disabled", true);
                },
                success: function(response) {
                    var userId = response.userId;
                    $("#form").find("input[type=submit]").attr("disabled", false);
                    $("#form").jqFormResponse({
                        response: response,
                        successUri: "<g:createLink action='success'/>"+"?userId=" + userId
                    });

                },
                error: function() {
                    $("#form").find("input[type=submit]").attr("disabled", false);
                }
            });
        }(jQuery));


        function updateCity(){
            var provinceId = $("#form-province").val();
            jQuery.ajax({
                type:'POST',
                data:'provinceId='+provinceId,
                url:'/photobox/photo/listByCity',
                success:function(data,textStatus){
                    console.log(data);

                    jQuery('#city').html(data);
                },
                error:function(XMLHttpRequest,textStatus,errorThrown){
                }
            });
            jQuery('#form-district').html('<select><option value="">--请选择--</option></select>');
        }
        function check(){
            var province = $("#form-province").val();
            var city = $("#form-city").val();
            var district = $("#form-district").val();
            if(!$(".zp_zi_text").val()){
                sAlert("请输入收货人姓名");
                return false;
            }else if(!province){
                sAlert("请选择省");
                return false;
            }else if(!city){
                sAlert("请选择市");
                return false;
            }else if(!district){
                sAlert("请选择县");
                return false;
            }else if(!$("#form-address").val()){
                sAlert("请填写详细地址");
                return false;
            }
            return true;
        }
    </script>

    </div>
</div>

<g:render template="../home/footer" ></g:render>

